<script lang="ts">
    import { setContext } from "svelte";
    import type { AnchorLinkProps } from "./Anchor";
    import { AnchorContextKey, useAnchorContext } from "./Anchor.svelte";

    const props: AnchorLinkProps = $props();
    const ctx = useAnchorContext();
    const id = $props.id();
    const level = ctx.level;
    ctx.addLink(ctx.id, { ...props, id });
    setContext(AnchorContextKey, { ...ctx, level: level + 1, id: id });
</script>

{@render props.children?.()}
